<template>
	<view style="display: flex;align-items: center;justify-content: center;position: relative;" class="ag-custom-component-popup">
		<el-cascader class="ag-custom-component-popup" size="large" :options="regionData" @change="onChange">
		</el-cascader>
	</view>
</template>

<script>
	import {
		regionDataPlus,
		CodeToText,
		TextToCode
	} from 'element-china-area-data'
	export default {
		data() {
			return {
				regionData:regionDataPlus,
				currentValue: []
			}
		},
		methods: {
			onChange(e) {
				console.log(e)
				this.currentValue = e 
				if (e[0] === '') {
					// Remove the filter
					this.params.parentFilterInstance((instance) => {
						instance.onFloatingFilterChanged(['']);
					});
					return;
				}
			
				this.params.parentFilterInstance((instance) => {
					console.log('on floatting',this.currentValue)
						instance.onFloatingFilterChanged(this.currentValue)
					//instance.onFloatingFilterChanged('equals', this.currentValue);
				});
			},
			onParentModelChanged(parentModel) {
				// When the filter is empty we will receive a null value here
				if (!parentModel) {
					this.currentValue = '';
				} else {
					this.currentValue = parentModel.filter;
				}
			},
		}
	}
</script>
